/* mixin */
import fieldMixin from '@src/mixins/fieldMixin';
import FormDesignMixin from '@src/mixins/formDesign';
/* api */
import * as SettingServiceEventApi from '@src/api/SettingServiceEventApi';
/* util */
import * as FormUtil from '@src/component/form/util';
/* enum */
import TableNameEnum from '@model/enum/TableNameEnum.ts';
import i18n from '@src/locales'

// 模块名映射
const MODE_NAME_MAP = {
  [TableNameEnum.Event]: i18n.t('event.setting.serviceEventTypeSetting.flow.eventFieldsSetting.des1'),
  [TableNameEnum.EventReceipt]: i18n.t('event.setting.serviceEventTypeSetting.flow.eventFieldsSetting.des2')
}

export default {
  name: 'event-fields-setting',
  mixins: [fieldMixin, FormDesignMixin],
  props: {
    mode: {
      type: String,
      default: 'event'
    },
    templateId: {
      type: String,
      default: ''
    },
    templateName: {
      type: String,
      default: ''
    }
  },
  data(){
    return {
      init: false,
      pending: true,
      visble: false,
      fields: [] // 表单字段
    }
  },
  computed: {
    // 模块名
    modeName() {
      return MODE_NAME_MAP[this.mode];
    }
  },
  watch: {
    visble(val) {
      if(!val) this.$emit('success');
    }
  },
  methods: {
    /* 查询表单字段 */
    async initialize() {
      this.pending = true;
      SettingServiceEventApi.getEventTemplateFields({ tableName: this.mode, templateId: this.templateId, isFromSetting: true })
        .then(res => {
          this.fields = this.toFormField(res || []);
          this.init = true;
        })
        .finally(() => {
          this.pending = false;
        })
        .catch(e => console.log('initialize', e));     
    },
    // 打开表单设置弹窗
    open() {
      this.init = false;
      this.visble = true;
      this.initialize();
    },
    // 将后端字段转换成设计器可接受的字段
    toFormField(fields = []) {
      let sortedFields = fields.sort((a, b) => a.orderId - b.orderId);
      return FormUtil.toFormField(sortedFields);
    },
    /* 将字段转换成后端可接收的字段 */
    packToField(origin) {
      let fields = FormUtil.toField(origin);


      fields.forEach((field, index) => {
        field.templateId = this.templateId;
        field.templateName = this.templateName;
        field.tableName = this.mode;
        field.orderId = index;

        field.subFormFieldList &&
          field.subFormFieldList.forEach((subField, subIndex) => {
            subField.templateId = this.templateId;
            subField.templateName = this.templateName;
            subField.tableName = this.mode;
            subField.orderId = subIndex;
          });
          
      })
      return fields;
    },
    /** 
    * @description 提交表单字段设置
    */
    async submit() {
      try {
        let fields = this.packToField(this.fields);
        console.log('保存', fields)
        
        // 表单字段格式校验
        let message = FormUtil.validate(fields);
        if(!FormUtil.notification(message, this.$createElement)) return;

        this.pending = true;

        let result = await SettingServiceEventApi.saveEventFields(fields);

        let isSuccess = result.succ;
        this.$platform.notification({
          type: isSuccess ? 'success' : 'error',
          title: isSuccess ? i18n.t('event.setting.serviceEventTypeSetting.flow.eventFieldsSetting.tips1', {data1:this.modeName}) : i18n.t('event.setting.serviceEventTypeSetting.flow.eventFieldsSetting.tips2', {data1:this.modeName}) ,
          message: isSuccess ? null : result.message
        })

        if(isSuccess) {
          this.visble = false;
        }

      } catch (error) {
        console.error(error)
      }

      this.pending = false;
    }
  }
}